<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>服务记录</title>
	<meta name="decorator" content="default"/>
	<script src="${ctxStatic}/layer/layer.js"></script>
	<script src="${ctxStatic}/js/utils/Jutils.js"></script>
	<script type="text/javascript">
		function  autoAdaptHeight() {
			$(".form-contanier").each(function (index,dom) {
				var autoHeight=$(this).closest(".item-box-center").outerHeight(true);
				$(this).css("height",autoHeight);
				$(this).closest(".item-box").find(".item-box-title").each(function (index,dom) {
					$(dom).css("height",autoHeight).css("line-height",autoHeight+"px");
				});
				$(this).closest(".item-box").find(".item-box-right").each(function (index,dom) {
					$(dom).css("height",autoHeight).css("line-height",autoHeight+"px");
				})
			});
		}
	$(function () {
		function  reloadMaterial() {
			var param={};
			param["memberId"]=$("#memberId").val()||"";
			$("#material_upload").load("${ctx}/sys/material/materialType/memberMaterialUploadList",param,function () {
				autoAdaptHeight();
			});
		}
		function bindEvents(){
			//添加上传资料
			$(".btn_add").click(function () {
				//追加一栏html
				var typeId=$("#type_select").val();
				$("<p>").append($(this).clone()).html();
				//获取自身html
				var html=$("<p>").append($("#template").find("#item_form[data-id="+typeId+"]").clone()).html();
				if($(html).find(".form-contanier div").length>0){
					$("#item_container").prepend(html);
					autoAdaptHeight();
				}else{
					layer.alert("添加失败，该类型下没有资料属性！",-1);
				}

			});
			$("body").on("click",".item-del",function () {
				var that=$(this);
				layer.confirm("确定要删除吗？",{offset: ['300px', '500px']},function () {
					var param={};
					var groupInput=that.closest("#item_form").find("input[name='groupId']");
					console.log(groupInput)
					if(groupInput.length>0){
						param["groupId"]=groupInput.val();
					}else if(groupInput.length==0&&$("#item_form").data("id")){
						//没有分组id就是新建 那就直接删除dom
						that.closest("#item_form").remove();
						layer.closeAll();
						return;
					}
					param["memberId"]=$("#memberId").val()||"";
					$.ajax({
						type : "POST",  //提交方式
						url : "${ctx}/sys/material/materialType/delMemberMaterialUpload",//路径
						traditional: true,
						data : param,//数据，这里使用的是Json格式进行传输
						success : function(data) {//返回数据根据结果进行相应的处理
							if(data){
									reloadMaterial();
								layer.closeAll();
							}else{
								layer.alert("操作失败",{offset: ['300px', '500px']},-1);
							}
						}
					});
				});
			})
			$("body").on("click",".item-save",function () {
				var param={};
				var paramArrayOut=[];
				$(this).closest("#item_form").find(".up_item").each(function (index,dom) {
					var isPass=false;//校验标记  对每一组进行校验 比如对 身份证资料类型的id value typeId进行校验
					var paramObj={};
					$(this).find("input,select,textarea").each(function (index1,dom1) {
						var name=$(this).attr("name");
						var value=$(this).val();
						//radio要选中才设值
						if("radiovalue"==name){
							if ($(this).attr("checked")) {
								paramObj[name]=value;
								isPass=true;
							}
						}else{
							paramObj[name]=value;
						}
					});
					if(!$.isEmptyObject(paramObj)){
						for(var key in paramObj){
						    alert(paramObj);
							if(key=="value"&&paramObj[key]){
								isPass=true;
							}else if(key=="iconvalues"&&paramObj[key]){
								isPass=true;
							}
						}
					}
					if(isPass){
						paramArrayOut.push(paramObj)
					}
				});
				$.each(paramArrayOut,function (index1,obj) {
					for(var key  in obj){
						param["mus["+index1+"]."+key]=obj[key];
					}
				});
					param["memberId"]=$("#memberId").val();
					var groupInput=$(this).closest("#item_form").find("input[name='groupId']");
					if(groupInput.length>0){
						param["groupId"]=$(this).closest("#item_form").find("input[name='groupId']").val();
					}else if(groupInput.length==0&&$("#item_form").data("id")){
						//没有分组id就是新建
						param["isNew"]="1";
					}
					$.ajax({
						type : "POST",  //提交方式
						url : "${ctx}/sys/material/materialType/saveMemberMaterialUpload",//路径
						traditional: true,
						data : param,//数据，这里使用的是Json格式进行传输
						success : function(data) {//返回数据根据结果进行相应的处理
							if(data){
								layer.alert("操作成功",{offset: ['300px', '500px']},function(){
									//刷新页面
									reloadMaterial();
									layer.closeAll();
								});
							}else{
								layer.alert("操作失败",{offset: ['300px', '500px']},-1);
							}
						}
					});
			})
		}
		bindEvents();
		reloadMaterial();

	});
	</script>
</head>
<body style="text-align: center;height: 100%;">
<ul class="nav nav-tabs">
	<li ><a href="${ctx}/sys/member/member/">用户信息列表</a></li>
	<shiro:hasPermission name="sys:member:member:edit"><li class="active"><a >上传资料</a></li></shiro:hasPermission>
</ul>
<input type="hidden" id="memberId" value="${member.id}">
<sys:message content="${message}"/>
<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
	<%--<div style="float: left;width:500px">
		<h1>【${member.username}】资料分类：</h1>
		<div id="material_list" style="min-height: 400px;width: 500px; border: 1px solid beige ">

		</div>
	</div>--%>

	<div style="float: left;min-width: 800px;margin: 0 auto;text-align: center" >

		<div style="overflow: hidden"><h1>【${member.username}】已上传的资料：</h1>
			<div style="float: right">
				资料类型：<select id="type_select" style="width: 110px !important;">
					<c:forEach var="type" items="${types}" varStatus="typeStatus">
						<option  data-id="${type.id}" value="${type.id}">${type.name}</option>
					</c:forEach>
				</select>
				<button type="button" class="btn btn-info btn_add"  >添加</button>
			</div>
		</div>
		<div style="float: right; color: red;">*身份证有效期为长期的选取较大的日期:2099-12-31</div>
		<div id="material_upload" style="min-height: 400px;min-width: 800px; border: 1px solid beige;padding: 5px">

		</div>
	</div>
</body>
</html>